<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <script>
    var showTr;
    window.onload = function () {
      showTr = document.getElementById("oneTr");
    }
    function showT(trId) {
      showTr.style.backgroundColor = "aqua";
      var trObj = document.getElementById(trId);
      trObj.style.backgroundColor = "whitesmoke"
      showTr = trObj;
    }
  </script>
</head>
<body>
  <div>
    <table border="1" cellspacing="0" width="300px" style="background-color: aqua">
      <tr><th>姓名</th><th>年龄</th><th>性别</th><th>学历</th></tr>
      <tr id="oneTr" onclick="showT('oneTr')" style="background-color: whitesmoke"><td>张三</td><td>20</td><td>男</td><td>大专</td></tr>
      <tr id="twoTr" onclick="showT('twoTr')"><td>李四</td><td>21</td><td>女</td><td>本科</td></tr>
      <tr id="threeTr" onclick="showT('threeTr')"><td>王五</td><td>22</td><td>女</td><td>本科</td></tr>
      <tr id="fourTr" onclick="showT('fourTr')" ><td>赵六</td><td>25</td><td>男</td><td>博士</td></tr>
    </table>
  </div>
</body>
</html>
